<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="__STATIC__/css/layui.css">
  <link rel="stylesheet" href="__STATIC__/css/view.css" />
  <link rel="icon" href="/favicon.ico">
  <title>管理后台</title>
</head>

<body class="layui-view-body">
  <div class="layui-content">
    <!-- <div class="layui-page-header">
            <div class="pagewrap">
                <span class="layui-breadcrumb">
                  <a><cite>管理员列表</cite></a>
                </span>
            </div>
        </div> -->
    <div class="layui-row">
      <div class="layui-card">
        <div class="layui-card-body">
          <div class="form-box">
            <button class="layui-btn layui-btn-blue" onclick="openAdd()"><i class="layui-icon">&#xe654;</i>新增</button>
            <table class="layui-table" lay-data="{height:'full-200', url:'{:url('Category/categorylist')}', page:true, id:'test2', skin: 'row', even: true}"
              lay-filter="demo">
              <thead>
                <tr>
                  <th lay-data="{field:'id',sort: true}">ID</th>
                  <th lay-data="{field:'name'}">栏目名称</th>
                  <th lay-data="{field:'parent_id',templet: '#parent_id'}">父分类</th>
                  <th lay-data="{field:'is_parent',templet: '#is_parent'}">是否为大分类</th>
                  <th lay-data="{title:'操作', templet: '#barDemo'}"></th>
                </tr>
              </thead>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
  <script type="text/html" id="parent_id">
    {{#  if(d.parent_id == null){ }}

        {{#  } else { }}
          {{ d.parent_id }}
        {{#  } }}
      </script>
  <script type="text/html" id="is_parent">
    {{#  if(d.is_parent == 2){ }}
          <span style="color: red;">否</span>
        {{#  } else { }}
        <span style="color: red;">是</span>
        {{#  } }}
      </script>
  <script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
      </script>
  {include file="common/footer"}
  <script src="__STATIC__/layui.all.js"></script>
  <script>
    layui.use('table', function () {
      var table = layui.table;
      //监听工具条
      table.on('tool(demo)', function (obj) {
        var data = obj.data;
        if (obj.event === 'del') {
          layer.confirm('真的删除行么', function(index){
          del(data.id);
          layer.close(index);
      });
        }
      });
    })
     /*删除*/
  function del(id){
    console.log(id)
    $.ajax({
      type: 'POST',
      url: "{:Url('Category/del')}",
      data: {"id":id},
      dataType: 'text',
      success: function(data){
          window.location.reload();
      },
      error:function(data) {
        console.log(data.msg);
      },
    });
}
    function openAdd() {
      var that = this;
      //多窗口模式，层叠置顶
      layer.open({
        type: 2 //此处以iframe举例
          ,
        title: '添加分类',
        area: ['700px', '500px'],
        shade: 0,
        maxmin: true,
        offset: 'auto',
        content: "{:Url('Category/add')}",
        btn: ['关闭'] //只是为了演示
          ,
        yes: function (index) {
          layer.close(index);
        },
        zIndex: layer.zIndex //重点1
          ,
        success: function (layero) {
          layer.setTop(layero); //重点2
        }
      });
    }
  </script>
</body>

</html>